﻿@model Sheng.WeixinConstruction.Management.Shell.Models.ShakingLotteryGiftListViewModel

@{
    ViewBag.MainMenu = "Campaign";
    ViewBag.LeftMenu = "ShakingLottery";

    ViewBag.Title = "摇一摇抽奖";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<script>

    var _id = getQueryString("id");

    //当前页
    var _currentPage = 1;

    $(document).ready(function ()
    {
        if (_online == false)
            return;

        @if (Model.CampaignBundle.Campaign.Status == Sheng.WeixinConstruction.Infrastructure.EnumCampaignStatus.End)
        {
            @:$("#btnCreate").hide();
        }

        loadData();

        $("[keyenter]").keypress(function (e)
        {
            if (e.keyCode == 13)
            {
                loadData();
            }
        });
    });

    function loadData(targetPage)
    {
        var loadLayerIndex = layer.load(0, {
            shade: [0.2, '#fff']
        });

        //var args = new Object();
        //args.Page = targetPage || 1;
        //args.CampaignId = _id;
       // args.Name = $("#txtSearch_Name").val();

        $.ajax({
            url: "/Api/Campaign/GetShakingLotteryGiftList?campaignId=" + _id,
            type: "POST",
            dataType: "json",
         //   data: JSON.stringify(args),
            success: function (data, status, jqXHR)
            {
                // alert(data);

                layer.close(loadLayerIndex);
                if (data.Success)
                {
                    var resultObj = data.Data;

                  //  _currentPage = resultObj.Page;

                   //alert(JSON.stringify(resultObj));
                    var gettpl = document.getElementById('tableTemplate').innerHTML;
                    laytpl(gettpl).render(resultObj, function (html)
                    {
                        document.getElementById('divTableBodyContainer').innerHTML = html;
                        fitTable();
                    });

                    laypage({
                        skin: 'yahei',
                        cont: document.getElementById('divPagingContainer'),
                        pages: resultObj.TotalPage, //总页数
                        curr: resultObj.Page, //当前页
                        groups: 7, //连续显示分页数
                        jump: function (obj, first)
                        {
                            if (!first)
                            { //点击跳页触发函数自身，并传递当前页：obj.curr
                                loadData(obj.curr);
                            }
                        }
                    });

                } else
                {
                    layerAlert(data.Message);
                }
            },
            error: function (xmlHttpRequest)
            {
                layer.close(loadLayerIndex);
                alert("Error: " + xmlHttpRequest.status);
            }
        });
    }

    function scrollHeader()
    {
        // alert(divTableBodyContainer.scrollLeft);
        var ml = 0 - divTableBodyContainer.scrollLeft;
        document.getElementById("tableHeader").style.cssText = "margin-left:" + ml + "px;";
    }

    function fitTable()
    {
        $("#tableBody").width($("#tableHeader").width());

        $("#tableHeader tr:first").each(function (n, value)
        {
            $(this).find("td").each(function (n, value)
            {
                $("#tableBody tr:first td:eq(" + n + ")").width(value.width)
            });
        });
    }

    function loadDataAndCloseLayer(layerIndex)
    {
        layer.close(layerIndex);
        loadData();
    }

    function loadDataOnPageAndCloseLayer(layerIndex)
    {
        layer.close(layerIndex);
        loadData(_currentPage);
    }

    function create()
    {
        //alert(0);
        layer.open({
            type: 2,
            area: ['740px', '530px'], //宽高
            closeBtn: false,
            title: "",
            shift: _layerShift,
            content: 'ShakingLotteryGiftEdit?campaignId=' + _id
        });
    }

    function modify(id)
    {
        layer.open({
            type: 2,
            area: ['740px', '530px'], //宽高
            closeBtn: false,
            title: "",
            shift: _layerShift,
            content: 'ShakingLotteryGiftEdit?id=' + id + "&campaignId=" + _id
        });
    }

    function changePage(url)
    {
        window.location.href = url + "?id=" + _id;
    }


</script>

<script id="tableTemplate" type="text/html">

    <table id="tableBody" border="0" cellspacing="0" cellpadding="0">

        {{# for(var i = 0, len = d.length; i < len; i++){ }}
        <tr>
            <td height="35"><a href="javascript:void(0)" onclick="modify('{{ d[i].Id }}')">{{ d[i].Name }}</a></td>
            <td>{{ d[i].PeriodName }}</td>
            <td>
                {{# if(d[i].IsGift == true){ }}
                是
                {{# }else { }}
                否
                {{# } }}
            </td>
            <td>{{ d[i].Stock }}</td>
            <td>{{ d[i].Probability }}</td>
        </tr>
        {{# } }}

    </table>

</script>

<div style="margin-top: 25px; margin-left: 10px;" class="font_black_24">
    @Model.CampaignBundle.Campaign.Name
</div>

<div style="margin-top: 30px;">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td class="td_ContentTab" style="width: 150px;">
                <a href="javascript:void(0)" class="a_black_16" onclick="changePage('/Campaign/ShakingLotteryDetail')">摘要</a>
            </td>
            @if (Model.CampaignBundle.ShakingLottery.Mode == Sheng.WeixinConstruction.Infrastructure.EnumCampaign_ShakingLotteryMode.Period)
            {
                <td class="td_ContentTab" style="width: 150px;">
                    <a href="javascript:void(0)" class="a_black_16" onclick="changePage('/Campaign/ShakingLotteryPeriodList')">周期</a>
                </td>
            }
            <td class="td_ContentTab_active" style="width: 150px;">
                奖品
            </td>
            <td class="td_ContentTab" style="width: 150px;">
                <a href="javascript:void(0)" class="a_black_16" onclick="changePage('/Campaign/ShakingLotteryGiftWinningList')">中奖记录</a>
            </td>
            <td align="right">
                &nbsp;
            </td>
        </tr>
        <tr>
            <td colspan="5" bgcolor="#EEEEEE" height="2"></td>
        </tr>
    </table>
</div>

<div style="margin-top:10px;">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td>
                <div style="padding:10px;">
                    <table width="100%" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                           
                            <td align="left">
                                <input name="btnCreate" type="button" class="btn_blue" id="btnCreate" value="添 加" onclick="create()" />
                                <span style="margin-left:10px;" >注意：奖品的添加修改删除操作，在微信端约需要10分钟左右时间生效。</span>
                            </td>
                        </tr>
                    </table>

                </div>
            </td>
        </tr>

    </table>

</div>

<div style=" margin-top:10px">
    <div style="overflow:hidden; padding-left:20px;" class="tableHeader">

        <table id="tableHeader" border="0" cellspacing="0" cellpadding="0" width="900" height="47">
            <tr>
                <td width="300">名称</td>
                <td width="300">所属周期</td>
                <td width="100">是否中奖</td>
                <td width="100">库存</td>
                <td width="100">概率数</td>
            </tr>
        </table>

    </div>



    <div style=" margin-top:10px">
        <!--div必须要设置height，否则滚动条出不来-->
        <div id="divTableBodyContainer" style="overflow:auto; height:100%;padding-left:20px;" onscroll="scrollHeader()">
            @*<div style="background-color:aqua" id="demo1"></div>*@
            <!--table必须要有一个确切的宽度，否则无法超出div-->
            @*<table id="tableBody" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td><input type="checkbox" /></td>
                        <td height="35"><a href="#">电子影票一张</a></td>
                        <td>20</td>
                        <td>100</td>
                        <td>12</td>
                        <td>是</td>
                    </tr>
                </table>*@
        </div>

    </div>

</div>

<div style="height:1px; margin-top:5px; background-color:#cccccc">

</div>

<div id="divPagingContainer" style=" margin-top:20px; margin-bottom:20px;text-align:right; ">

</div>


